<script src="app/controllers/sitemaps/MonitorPostedController.js"></script>

<div class="hfr-loading" ng-class="{true:'hfr-showContent', false:''}[showViewContent]" ng-controller="MonitorPostedController">
	<div class="hfr-contentLoadingBar">
		<div id="dot1" class="loader-dot"></div>
		<div id="dot2" class="loader-dot"></div>
		<div id="dot3" class="loader-dot"></div>
	</div>
	<div class="hfr-loadingStatus">
		
		<!-- VIEW Monitor Posted
    	================================================== -->
		<div id="hfr-monitorPosted" class="container hfr-margin-auto">
			<h2 class="hfr-heading">{{'static.monitorPosted.title' | translate}} <span class="number-notify hfr-preShow" title="{{total}}" ng-class="{'hfr-show': total !== undefined}">{{total}}</span></h2>
		
			<form name="searchForm">
				<div class="row">
					<div class="col-md-10">
						<div class="row">
							<div class="col-md-3">
								<div class="form-group">
									<div class="input-group">
										<input type="text" class="form-control" placeholder="{{'static.monitorPosted.placeholderStartTime' | translate}}" datepicker-popup="{{format}}" is-open="openedStartTime" 
											ng-model="startTime" name="startTime" required>
										<span class="input-group-addon ti-calendar" ng-click="openStartTime($event)"></span>
									</div>
									<span class="label label-danger" ng-show="submitted && searchForm.startTime.$error.required">{{'message.error.required' | translate}}</span>
								</div>
							</div>
							<div class="col-md-3">
								<div class="form-group">
									<div class="input-group">
										<input type="text" class="form-control" placeholder="{{'static.monitorPosted.placeholderEndTime' | translate}}" datepicker-popup="{{format}}" is-open="openedEndTime" 
											ng-model="endTime" name="endTime" required>
										<span class="input-group-addon ti-calendar" ng-click="openEndTime($event)"></span>
									</div>
									<span class="label label-danger" ng-show="submitted && searchForm.endTime.$error.required">{{'message.error.required' | translate}}</span>
								</div>
							</div>
							<div class="col-md-4">
								<div class="form-group">
									<input type="text" ng-model="blogSelected" placeholder="{{'static.monitorPosted.placeholderFilterBlog' | translate}}" 
										typeahead="blog as blog.url for blog in blogs | filter:{url:$viewValue}" ng-enter="search(searchForm, true)" class="form-control">
								</div>
							</div>
							<div class="col-md-2">
								<button type="submit" class="hfr-button-blue hfr-solid hfr-button-small" ng-click="search(searchForm, true)">{{'static.monitorPosted.btnSearch' | translate}}</button>
							</div>
						</div>
					</div>
					<div class="col-md-1 col-md-offset-1 hfr-viewStyle">
						<span class="ti-view-list" ng-click="changeViewList()"></span>
						<span class="ti-layout-grid2" ng-click="changeViewGrid()"></span>
					</div>
				</div>
				<div class="hfr-loading" ng-class="{'hfr-showContent': showSuccessPosted, 'hfr-showReloadSection': showReload['display']}">
					<div class="hfr-contentLoadingBar">
						<div id="dot1" class="loader-dot"></div>
						<div id="dot2" class="loader-dot"></div>
						<div id="dot3" class="loader-dot"></div>
					</div>
					<div class="hfr-reloadSection">
						<p>{{showReload['text']}}</p>
						<a href><span class="ti-reload"></span> {{'static.layout.reload' | translate}}</a>
					</div>
					<div class="hfr-loadingStatus">
						<div class="hfr-noContent hfr-preShow" ng-class="{'hfr-show': total == 0}">{{'static.layout.noResult' | translate}}</div>
						<div class="hfr-preShow" ng-class="{'hfr-show': total > 0}">
							<ul class="hfr-listPosted clearafter" ng-class="{'hfr-gridStyle': gridStyle}">
								<li>
									<div class="row">
										<div class="col-md-8"><strong>{{'static.monitorPosted.listTitle' | translate}}</strong></div>
										<div class="col-md-2"><strong>{{'static.monitorPosted.listCreated' | translate}}</strong></div>
									</div>
								</li>
								<li ng-repeat="postSuccess in listPostSuccess" ng-class="{true:'active', false:''}[showSocial[$index]]">
									<div class="inner">
										<a href="{{getUrl(postSuccess)}}" target="_blank" class="ti-new-window"></a>
										<div class="shareThis">
											<span class="ti-sharethis" ng-click="displayShare($index)"></span>
											<div class="social">
												<a href class="ti-facebook" ng-click="shareFacebook(postSuccess)"></a>
												<a href class="ti-google" ng-click="shareGoogle(postSuccess)"></a>
												<a href class="ti-twitter-alt" ng-click="shareTwitter(postSuccess)"></a>
												<a href class="ti-linkedin" ng-click="shareLinkedIn(postSuccess)"></a>
											</div>
										</div>
										<div class="row">
											<div class="col-md-8">
												<div class="hfr-titlePosted">{{postSuccess.title}}</div>
												<a class="hfr-subText" href="{{getUrl(postSuccess)}}" target="_blank">{{postSuccess.blogId}}<span class="paragraph-end"></span></a>
											</div>
											<div class="col-md-2 created">{{postSuccess.date | date:'dd-MM-yyyy'}}</div>
											<div class="col-md-2 action">
												<a tooltip-placement="top" tooltip="{{'static.layout.edit' | translate}}" class="ti-pencil hfr-button-green hfr-shrink" href></a>
												<a tooltip-placement="top" tooltip="{{'static.layout.remove' | translate}}" class="ti-close hfr-button-red hfr-shrink" href></a>
											</div>
										</div>
									</div>
								</li>
							</ul>
							<ul class="pager" ng-show="showPrev || showNext">				
								<li ng-class="{true:'active', false:'disabled'}[showPrev]" ng-click="prevPage(searchForm)" ng-disabled="showPrev == false"><a href>&larr; {{'static.layout.pagePrev' | translate}}</a></li>
								<li ng-class="{true:'active', false:'disabled'}[showNext]" ng-click="nextPage(searchForm)" ng-disabled="showNext == false"><a href>{{'static.layout.pageNext' | translate}} &rarr;</a></li>
							</ul>
						</div>
					</div>
				</div>
			</form>
		</div>
		<!-- =============== End view =============== -->
	</div>
</div>